import type { SVGProps } from 'react'

/**
 * MoreHorizontal icon component (three horizontal dots)
 * @param props - SVG properties including className, fill, etc.
 */
export function MoreHorizontal(props: SVGProps<SVGSVGElement>) {
  return (
    <svg
      width='12'
      height='3'
      viewBox='0 0 12 3'
      fill='none'
      xmlns='http://www.w3.org/2000/svg'
      {...props}
    >
      <path
        d='M10.6418 2.71638C10.4635 2.71644 10.2869 2.68137 10.122 2.61316C9.95724 2.54496 9.80748 2.44496 9.68132 2.31889C9.55516 2.19281 9.45507 2.04311 9.38676 1.87835C9.31845 1.71359 9.28326 1.53699 9.2832 1.35863C9.28315 1.18027 9.31822 1.00364 9.38642 0.838837C9.45463 0.674032 9.55462 0.524274 9.6807 0.398113C9.80678 0.271953 9.95648 0.171862 10.1212 0.103554C10.286 0.0352452 10.4626 5.73617e-05 10.641 7.01687e-08C11.0012 -0.000115635 11.3467 0.142868 11.6015 0.397497C11.8563 0.652125 11.9995 0.99754 11.9996 1.35775C11.9997 1.71797 11.8567 2.06348 11.6021 2.31827C11.3475 2.57306 11.0021 2.71627 10.6418 2.71638Z'
        fill='currentColor'
      />
      <path
        d='M5.99937 2.71642C6.74924 2.71642 7.35713 2.10854 7.35713 1.35867C7.35713 0.608803 6.74924 0.000915527 5.99937 0.000915527C5.24949 0.000915527 4.6416 0.608803 4.6416 1.35867C4.6416 2.10854 5.24949 2.71642 5.99937 2.71642Z'
        fill='currentColor'
      />
      <path
        d='M1.35776 2.71655C2.10764 2.71655 2.71553 2.10866 2.71553 1.35879C2.71553 0.608925 2.10764 0.0010376 1.35776 0.0010376C0.607891 0.0010376 0 0.608925 0 1.35879C0 2.10866 0.607891 2.71655 1.35776 2.71655Z'
        fill='currentColor'
      />
    </svg>
  )
}
